<template>
  <div>

    <el-row style="margin-top: 2%; margin-bottom: 2%">
      <el-col :span="6">
        <el-select v-model="searchPath">
          <el-option
            v-for="item in searchOptions"
            :key="item[0]"
            :value="item[1]"
            :label="item[0]"
          >
          </el-option>
        </el-select>
      </el-col>
      <el-col :span="12">
        <el-input v-model="queryString" type="text"></el-input>
      </el-col>
      <el-col :span="6">
        <el-button type="primary" @click="sendReq(queryString,null,curPage,pageSize)"> 查询</el-button>
        <el-button type="primary" @click="filterSend">复杂查询</el-button>
      </el-col>
    </el-row>
    <el-row>
      <el-col class="dispFilter" :span="6">
        <el-card style="margin-right: 30px;">
          <el-button style="margin-top: 2%;"
                     @click="filterSend"
                     type="success">应用过滤器
          </el-button>

          <el-collapse style="margin-top: 2%;">
            <el-collapse-item title="发表时间" name="0">
              <el-slider
                style=" width: 80%;margin:0 auto;display: block;"
                v-model="searchFilter.yearInterval"
                range
                :min="1900"
                :max="new Date().getFullYear()">
              </el-slider>
              <el-row>
                <el-col :span="12" style="padding-right: 2%;padding-left: 2%;">
                  <el-input v-model="searchFilter.yearInterval[0]" disabled></el-input>
                </el-col>
                <el-col :span="12" style="padding-right: 2%;padding-left: 2%;">
                  <el-input v-model="searchFilter.yearInterval[1]" disabled></el-input>
                </el-col>
              </el-row>


            </el-collapse-item>
            <el-collapse-item title="文献类型" name="1">
              <el-checkbox-group v-model="searchFilter.typeList">
                <el-checkbox
                  v-for="type in typeListView"
                  :key="type"
                  :label="type">
                </el-checkbox>
              </el-checkbox-group>
            </el-collapse-item>
            <el-collapse-item title="作者列表" name="2">
              <el-checkbox-group v-model="searchFilter.authorList">
                <el-checkbox
                  v-for="author in authorListView.slice(0,5)"
                  :key="author[0]"
                  :label="author[0]"
                  :value="author[1]">
                </el-checkbox>
                <el-collapse-item title="展示全部作者" v-if="authorListView.length>5">
                  <el-checkbox
                    v-for="author in authorListView.slice(5)"
                    :key="author[0]"
                    :label="author[0]"
                    :value="author[1]">
                  </el-checkbox>
                </el-collapse-item>

              </el-checkbox-group>
            </el-collapse-item>
            <el-collapse-item title="出版社" name="3">
              <el-checkbox-group v-model="searchFilter.journalList">
                <el-checkbox
                  v-for="type in journalListView.slice(0,5)"
                  :key="type"
                  :label="type">
                </el-checkbox>
                <el-collapse-item title="展示全部出版社" v-if="journalListView.length>5">
                  <el-checkbox
                    v-for="publisher in journalListView.slice(5)"
                    :key="publisher"
                    :label="publisher"
                    :value="publisher">
                  </el-checkbox>
                </el-collapse-item>
              </el-checkbox-group>
            </el-collapse-item>
            <el-collapse-item title="其他" name="4">
              <el-form>
                <el-form-item label="是否对输入数据精确搜索">
                  <el-switch v-model="searchFilter.isExactMatch">
                  </el-switch>
                </el-form-item>
              </el-form>
            </el-collapse-item>
          </el-collapse>
        </el-card>
      </el-col>
      <el-col class="dispSearchResult" :span="18">

        <el-collapse v-model="dispWitchPart" accordion>
          <el-collapse-item name="article" v-if="articleHasSearch">
            <template slot="title">
              <b style="font-size: large;">文章信息</b><i class="header-icon el-icon-info"></i>
            </template>
            <div class="dispArticle">
              <el-row style="margin-top: 1%; margin-bottom: 1%" v-if="articleHasSearch">
                <el-col :span="8" style="text-align: left;">
                  排序方式：
                  <el-select v-model="selectedSort" @change="sortChange">
                    <el-option
                      v-for="item in sortOption"
                      :key="item"
                      :value="item"
                      :label="item"
                    >
                    </el-option>
                  </el-select>
                </el-col>
                <el-col :span="16">
                  <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="curPage"
                    :page-sizes="[10,20,50,100, 200, 500]"
                    :page-size="pageSize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="totalArticles">
                  </el-pagination>
                </el-col>
              </el-row>
              <div style="margin-top: 3%" class="toLeft">
                <el-card
                  v-for="(article,index) in articleList"
                  :key="index"
                  class="dispCard"
                >
                  <el-row>
                    <el-col :span="3" style="font-size: x-large;">
                      <i class="el-icon-download" @click="handleChange(article.sourceAsMap)"></i>
                      <i class="el-icon-share"></i>
                      <i class="el-icon-delete"></i>
                    </el-col>

                    <el-col :span="20">
                      <div>
                        <span v-for="(a, index) in article['sourceAsMap'].author" :key="index">
                          <span v-if="index!==0">,</span>
                          <el-link style="margin-left: 3px; color: cadetblue;"
                                   @click="jumpFromAuthor(a)"
                          >{{ a }}</el-link>
                        </span>
                      </div>
                      <div>
                        <div style="font-weight: bold">
                          <div v-html="article['sourceAsMap'].title">
                          </div>
                        </div>
                        <div>
                          <b>|</b> <span>{{ article['sourceAsMap'].year }}</span>
                          <b>|</b> <span>期刊：{{
                            subNull(article['sourceAsMap'].publisher, subNull(article.sourceAsMap.journal, "unknown"))
                          }}</span>
                          <b>|</b> <span>类型：{{ getType(article.index, " unknown index") }}</span>
                        </div>
                      </div>
                    </el-col>
                    <el-col :span="24">
                      <el-collapse @change="handleChange(article.sourceAsMap,article.id,article.index,index)">
                        <el-collapse-item title="展示更多信息">
                          <!--                      {{ dispArticleArr[index] }}-->
                          <div v-loading="!dispArticleArr[index]" style="min-height: 100px;">
                            <el-form v-if="dispArticleArr[index]">

                              <el-form-item label="下载地址">
                                <el-link type="primary" :underline="false"
                                         :disabled="article.sourceAsMap.ee[0]===null||article.sourceAsMap.ee[0]===undefined"
                                         :href="subNull(article.sourceAsMap.ee[0], '/') ">
                                  点击此处跳转至下载页面
                                </el-link>
                              </el-form-item>

                              <el-form-item label="研究领域">
                                <span v-for="a in subNull(article.sourceAsMap.extend.field,[])">
                                  <span style="margin-left: 3px; color: cadetblue;"
                                  >{{ a }}</span>
                                </span>
                              </el-form-item>
                              <el-form-item label="引用文献">
                                <el-table
                                  :data="subNull(article.sourceAsMap.extend.citeInfo,[])">
                                  <el-table-column label="标题">
                                    <template slot-scope="scope">
                                      <el-link @click="changeQuery(scope.row.title,offset)">
                                        {{ scope.row.title }}
                                      </el-link>
                                    </template>
                                  </el-table-column>
                                  <el-table-column label="出版年份" prop="year" sortable></el-table-column>
                                  <el-table-column label="被引数" prop="numCitedBy" sortable></el-table-column>
                                  <el-table-column label="引用数" prop="numCiting" sortable></el-table-column>
                                </el-table>
                              </el-form-item>
                            </el-form>
                          </div>
                        </el-collapse-item>
                      </el-collapse>

                    </el-col>
                  </el-row>
                </el-card>
              </div>
              <div v-if="articleHasSearch&&articleList.length===0">
                暂无信息
              </div>
            </div>
          </el-collapse-item>
          <el-collapse-item name="author" v-if="authorHasSearch">
            <template slot="title">
              <b style="font-size: large;">作者信息</b><i class="header-icon el-icon-info"></i>
            </template>
            <div class="dispAuthor">
              <el-row style="margin-top: 1%; margin-bottom: 1%" v-if="authorHasSearch">
                <el-col :span="8" style="text-align: left;">
                  排序方式：
                  <el-select v-model="selectedSort" @change="sortChange">
                    <el-option
                      v-for="item in sortOption"
                      :key="item"
                      :value="item"
                      :label="item"
                    >
                    </el-option>
                  </el-select>
                </el-col>
                <el-col :span="16">
                  <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="curPage"
                    :page-sizes="[10,20,50,100, 200, 500]"
                    :page-size="pageSize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="totalAuthors">
                  </el-pagination>
                </el-col>
              </el-row>
              <div class="toLeft">
                <el-card
                  v-for="(author,pos) in authorList"
                  :key="pos"
                >
                  <el-row>
                    <el-col :span="3" style="font-size: x-large;">
                      <i class="el-icon-user-solid"></i>
                    </el-col>

                    <el-col :span="20">
                      <div>
                        <span v-for="(a, index) in author['sourceAsMap'].author" :key="index">
                          <span v-if="index!==0">,</span>
                          <el-link style="margin-left: 3px; color: cadetblue;"
                                   @click="jumpFromAuthor(a)"
                          >{{ a }}</el-link>
                        </span>
                      </div>
                      <div>
                        <div style="font-weight: bold">
                          <div v-html="author['sourceAsMap'].note">
                          </div>
                        </div>
                        <div v-if="author['sourceAsMap'].url">URL: {{ author['sourceAsMap'].url }}</div>
                      </div>
                    </el-col>

                    <el-col :span="24">
                      <el-collapse @change="handleChange2(author['sourceAsMap'].author[0])">
                        <el-collapse-item title="他的文章" style="margin-bottom: 0px">
                          <el-form v-loading="!authorArList[author['sourceAsMap'].author[0]]">
                            <el-form-item>
                              <el-table v-if="authorArList[author['sourceAsMap'].author[0]]"
                                        :data="authorArList[author['sourceAsMap'].author[0]].list">
                                <el-table-column label="标题" prop="title" sortable></el-table-column>
                                <el-table-column label="出版年份" prop="year" sortable></el-table-column>
                                <el-table-column label="链接" prop="ee"></el-table-column>
                              </el-table>
                            </el-form-item>
                            <el-form-item>
                          <span v-if="authorArList[author['sourceAsMap'].author[0]]"
                                style="float: right; padding-right: 5px;">
                            共有{{ authorArList[author['sourceAsMap'].author[0]].num }}篇，
                            <el-link type="primary"
                                     @click="jumpFromAuthor(author['sourceAsMap'].author[0])">查看更多</el-link>
                          </span>
                            </el-form-item>
                          </el-form>
                        </el-collapse-item>
                      </el-collapse>

                    </el-col>
                  </el-row>
                </el-card>
              </div>
              <div v-if="authorHasSearch&&authorList.length===0">
                暂无信息
              </div>
            </div>
          </el-collapse-item>
          <el-collapse-item name="conf" v-if="confHasSearch">
            <template slot="title">
              <b style="font-size: large;">会议信息</b><i class="header-icon el-icon-info"></i>
            </template>
            <div class="dispConf">
              <el-row style="margin-top: 1%; margin-bottom: 1%" v-if="confHasSearch">
                <el-col :span="8" style="text-align: left;">
                  排序方式：
                  <el-select v-model="selectedSort" @change="sortChange">
                    <el-option
                      v-for="item in sortOption"
                      :key="item"
                      :value="item"
                      :label="item"
                    >
                    </el-option>
                  </el-select>
                </el-col>
                <el-col :span="16">
                  <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="curPage"
                    :page-sizes="[10,20,50,100, 200, 500]"
                    :page-size="pageSize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="totalConfs">
                  </el-pagination>
                </el-col>
              </el-row>
              <div class="toLeft">
                <el-card
                  v-for="(conf,pos) in confList"
                  :key="pos"
                  class="dispCard"
                >
                  <el-row>
                    <el-col :span="3" style="font-size: x-large;">
                      <i class="el-icon-download" @click="handleChange(conf.sourceAsMap)"></i>
                      <i class="el-icon-share"></i>
                      <i class="el-icon-delete"></i>
                    </el-col>
                    <el-col :span="20">
                      <div>
                        <span v-for="(e, index) in conf['sourceAsMap'].editor" :key="index">
                          <span v-if="index!==0">,</span>
                          <el-link style="margin-left: 3px; color: cadetblue;"
                                   @click="jumpFromAuthor(e)"
                          >{{ e }}</el-link>
                        </span>
                      </div>
                      <div>
                        <div style="font-weight: bold">
                          <div v-html="conf['sourceAsMap'].title">
                          </div>
                        </div>
                        <div>
                          <b>|</b> <span>{{ conf['sourceAsMap'].year }}</span>
                          <b>|</b> <span>期刊：{{
                            subNull(conf['sourceAsMap'].publisher, subNull(conf.sourceAsMap.journal, "unknown"))
                          }}</span>
                        </div>
                      </div>
                    </el-col>

                    <el-col :span="24">
                      <el-collapse @change="handleChange3(conf['sourceAsMap'].key)">
                        <el-collapse-item title="会议文章" style="margin-bottom: 0px">
                          <el-form v-loading="!inproList[conf['sourceAsMap'].key]">
                            <el-form-item>
                              <el-table v-if="inproList[conf['sourceAsMap'].key]"
                                        :data="inproList[conf['sourceAsMap'].key].list">
                                <el-table-column label="标题" prop="title" sortable></el-table-column>
                                <el-table-column label="出版年份" prop="year" sortable></el-table-column>
                                <el-table-column label="链接" prop="ee"></el-table-column>
                              </el-table>
                            </el-form-item>
                            <el-form-item>
                          <span v-if="inproList[conf['sourceAsMap'].key]"
                                style="float: right; padding-right: 5px;">
                            共有{{ inproList[conf['sourceAsMap'].key].num }}篇，
                            <el-link type="primary" @click="jumpFromProc(conf['sourceAsMap'])">查看更多</el-link>
                          </span>
                            </el-form-item>
                          </el-form>
                        </el-collapse-item>
                      </el-collapse>

                    </el-col>

                  </el-row>
                </el-card>
              </div>
              <div v-if="confHasSearch&&confList.length===0">
                暂无信息
              </div>
            </div>
          </el-collapse-item>
        </el-collapse>

        <div v-if="!articleHasSearch && !authorHasSearch && !confHasSearch" style="margin-top: 5%">
          <span>  请在搜索栏输入信息以开始搜索！</span>
        </div>

      </el-col>
    </el-row>
  </div>
</template>

<script>
import axios from 'axios'
import mapper from "../lib/mapper";
import Vue from "vue";

export default {
  name: "Search",
  mounted() {
    var param = this.$route.params
    if(param.crossQuery){
      this.changeQuery(param.queryStr,param.offset)
    }
  },
  computed: {
    typeListView() {
      return this.unique(this.articleList.map(article => article.index)).filter(obj => {
        return obj !== null && obj !== undefined && obj !== ""
      })
    },
    authorListView() {
      let allAuthor = {};
      this.articleList.forEach(article => {
        if (article.sourceAsMap.author !== undefined && article.sourceAsMap.author !== null) {
          article.sourceAsMap.author.forEach(author => {
            if (allAuthor.hasOwnProperty(author)) {
              allAuthor[author] += 1
            } else {
              allAuthor[author] = 1
            }
          })
        }
      })
      let authorArr = [];
      for (let key in allAuthor) {
        authorArr.push([key, allAuthor[key]])
      }
      authorArr.sort((a, b) => b[1] - a[1])
      return authorArr.filter(obj => {
        return obj !== null && obj !== undefined && obj !== ""
      })
    },
    journalListView() {
      return this.unique(this.articleList.map(article => article.sourceAsMap.journal)).filter(obj => {
        return obj !== null && obj !== undefined && obj !== ""
      })
    },

  },
  data: function () {
    return {

      dispWitchPart: "article",
      mapper: mapper,
      curPage: 1,
      pageSize: 10,
      // authorCurPage: 1
      // authorPageSize: 10,
      // ConfCurPage: 1,
      // ConfPageSize: 10,
      searchFilter: {
        yearInterval: [1900, 2022],
        isExactMatch: false,
        authorList: [],
        typeList: [],
        journalList: [],
      },
      filterChange: false,

      searchPath: "searchArticleByKW",
      displayPath: null,
      searchOptions: [
        ['综合', "mixSearch"],
        ['作者', "searchByAuthorKW"],
        ['文章', 'searchArticleByKW'],
        ['会议', 'getConferenceByKW'],
        // ['精确作者名', 'getArticleByAuthorId']
      ],
      sortOption: ['按相关度排序', '按时间排序'],
      selectedSort: '按相关度排序',
      queryString: null,
      articleList: [],
      totalArticles: 400,
      authorList: [],
      totalAuthors: 400,
      confList: [],
      totalConfs: [],
      articleHasSearch: false,
      authorHasSearch: false,
      confHasSearch: false,
      dispArticleArr: new Array(this.pageSize),
      dispAuthorArr: new Array(this.pageSize),
      dispConfArr: new Array(this.pageSize),
      srcObj: {
        "score": 3.2492623,
        "id": "-98MqXoBbybjfmdsAZy3",
        "type": "article",
        "nestedIdentity": null,
        "version": -1,
        "seqNo": -2,
        "primaryTerm": 0,
        "fields": {},
        "highlightFields": {},
        "sortValues": [],
        "matchedQueries": [],
        "explanation": null,
        "shard": null,
        "index": "test",
        "clusterAlias": null,
        "sourceAsMap": {
          "volume": "162",
          "journal": "IWBS Report",
          "year": "1991",
          "author": [
            "Gerd Kort",
            "m"
          ],
          "publisher": "IBM Germany Science Center, Institute for Knowledge Based Systems",
          "title": "rlichsprachlichen System",
          "key": "tr/ibm/IWBS162"
        },
        "innerHits": null,
        "rawSortValues": [],
        "sourceAsString": "{\"key\":\"tr/ibm/IWBS162\",\"title\":\"rlichsprachlichen System\",\"journal\":\"IWBS Report\",\"volume\":\"162\",\"year\":\"1991\",\"publisher\":\"IBM Germany Science Center, Institute for Knowledge Based Systems\",\"author\":[\"Gerd Kort\",\"m\"]}",
        "sourceRef": {
          "fragment": true
        },
        "fragment": false
      },
      authorArList: {},
      inproList: {},
      type: {
        'article': '杂志期刊文章',
        'inproceedings': '会议文章',
        'book': '书籍',
        'incollection': '书籍文章',
        'phdthesis': '博士论文',
        'mastersthesis': '硕士论文',
        'www': '网站'
      },
    }
  },
  methods: {
    sendReq(keys, filter, curPage, pageSize) {// mix查询以主分页为准

      let reqData = {
        keys: keys,
        filter: filter,
        curPage: curPage - 1,
        pageSize: pageSize,
      }
      console.log(reqData)
      axios.post('/api/' + this.searchPath, reqData).then(res => {
        if (res.data.success) {
          console.log(res)
          this.displayPath = this.searchPath
          // searchOptions: [
          //   ['综合', "mixSearch"],
          //   ['作者', "searchByAuthorKW"],
          //   ['文章', 'searchArticleByKW'],
          //   ['期刊与会议', 'getConferenceByKW'],
          //   // ['精确作者名', 'getArticleByAuthorId']
          // ],
          if (this.searchPath === "mixSearch") {
            this.resolveArticle(res.data.data[0])
            this.resolveAuthor(res.data.data[1])
            this.resolveConf(res.data.data[2])
          } else if (this.searchPath === "searchByAuthorKW") {
            this.resolveAuthor(res.data.data)
            this.articleHasSearch = false; // 清空其它查询,以不展示多余信息
            this.confHasSearch = false;
          } else if (this.searchPath === "searchArticleByKW" || this.searchPath === 'getArticleByAuthorId') {
            this.resolveArticle(res.data.data)
            this.confHasSearch = false;
            this.authorHasSearch = false;
          } else if (this.searchPath === "getConferenceByKW") {
            this.resolveConf(res.data.data)
            this.articleHasSearch = false;
            this.authorHasSearch = false;
          }
          console.log(this.articleList, this.authorList, this.confList)
          this.$message.success(res.data.info)
        } else {
          this.$message.error(res.data.info)
        }
      })
    },
    resolveArticle(data) {
      this.articleList = data['hits']
      this.totalArticles = data['totalHits'].value
      this.dispArticleArr = new Array(this.articleList.length).fill(false)
      this.articleHasSearch = true;
    },
    resolveAuthor(data) {
      this.authorList = data['hits']
      this.totalAuthors = data['totalHits'].value
      this.dispArticleArr = new Array(this.authorList.length).fill(false)
      this.authorHasSearch = true
    },
    resolveConf(data) {
      this.confList = data['hits']
      this.totalConfs = data['totalHits'].value
      this.dispConfArr = new Array(this.dispConfArr.length).fill(false)
      this.confHasSearch = true
    },


    async handleChange(src, id, index, offset) {
      console.log(src, id)
      src.disp = 0;

      let isInfoChange = false, isExtendChange = false, ssId = null;
      if (src.extend === undefined) {
        isExtendChange = true;
        src.extend = {}
      } else if (src.extend['ssId'] === undefined || src.extend['ssId'] === null) {
        isExtendChange = true;
      } else {
        ssId = src.extend['ssId'];
      }

      if (ssId === null) {
        await axios.post('https://www.semanticscholar.org/api/1/search',
          mapper.generateDetailQuery(src.title)).then(res => {
          if (res.data.results !== null && res.data.results.length > 0) {
            let topMatch = res.data.results[0]
            src.extend.ssId = topMatch.id
            ssId = topMatch.id
            src.extend['doiInfo'] = topMatch['doiInfo']
            src.extend['abstract'] = topMatch['paperAbstract']['text']
            src.extend['venue'] = topMatch['venue']['text']
            src.extend['field'] = topMatch['fieldsOfStudy']
          }
        }).catch(err => console.log(err))
      }
      if (ssId !== null && src.extend.citeInfo === undefined) {
        await axios.post("https://www.semanticscholar.org/api/1/search/paper/" + ssId + "/citations",
          mapper.citationParam).then(res => {
          isExtendChange = true;
          src.extend.citeInfo = res.data.results.map(obj => {
            return {
              title: obj.title.text,
              year: obj.year,
              numCitedBy: obj.numCitedBy,
              numCiting: obj.numCiting
            }
          })
        })
      }
      if (isExtendChange) {
        await axios.post('/api/updateSingle',
          {
            index: index,
            id: id,
            content: {
              extend: src.extend
            }
          }).then(res => {
          console.log(res)
          this.$message(res.data.info)
        })
      }
      console.log(src.extend)
      Vue.set(this.dispArticleArr, offset, true)

    },

    async handleChange2(author) {
      await axios.post('/api/getArticleByAuthorId', {
        keys: author,
        curPage: 0,
        pageSize: 5,
        filter: {},
      }).then(res => {
        if (res.data.success) {
          console.log(res.data)
          var item = {
            list: [],
            num: 0
          }
          item.num = res.data.data['totalHits'].value
          for (var i = 0; i < res.data.data['hits'].length; i++) {
            var map = res.data.data['hits'][i].sourceAsMap
            var tmp = {
              title: map.title,
              year: map.year,
              ee: map.ee[0]
            }
            item.list.push(tmp)
          }
          Vue.set(this.authorArList, author, item)
          console.log(this.authorArList)
        } else {
          this.$message.error(res.data.info)
        }
      })
    },

    async handleChange3(key) {
      await axios.post('/api/getArticleByConferenceId', {
        keys: key,
        curPage: 0,
        pageSize: 5,
        filter: {},
      }).then(res => {
        if (res.data.success) {
          console.log(res.data)
          var item = {
            list: [],
            num: 0
          }
          item.num = res.data.data['totalHits'].value
          for (var i = 0; i < res.data.data['hits'].length; i++) {
            var map = res.data.data['hits'][i].sourceAsMap
            var tmp = {
              title: map.title,
              year: map.year,
              ee: map.ee[0]
            }
            item.list.push(tmp)
          }
          Vue.set(this.inproList, key, item)
          console.log(this.inproList)
        } else {
          this.$message.error(res.data.info)
        }
      })
    },

    jumpFromAuthor(name) {
      this.$router.push({
        name: 'DispMap', params: {
          type: 'author',
          id: name,
          data: {}
        }
      })
    },
    jumpFromProc(data) {
      this.$router.push({
        name: 'DispMap', params: {
          type: 'proc',
          id: data.key,
          data: data
        }
      })
    },

    generateFilterObj() {
      return {
        exactMatch: this.searchFilter.isExactMatch,
        yearInterval: this.searchFilter.yearInterval,
        author: this.judgeSub(this.searchFilter.authorList !== [], this.searchFilter.authorList.join(" "), null),
        publicationType: this.judgeSub(this.searchFilter.typeList !== [], this.searchFilter.typeList.join(" "), null),
        publicationTitle: this.judgeSub(this.searchFilter.journalList !== [], this.searchFilter.journalList.join(" "), null),
        orderBy: this.selectedSort === "按相关度排序" ? null : 'year',
        ascOrder: false,
      }
    },
    subNull(val, alt) {
      if (val !== null && val !== undefined) {
        return val;
      } else {
        return alt;
      }
    },
    getType(val, alt) {
      if (val !== null && val !== undefined) {
        return this.type[val]
      } else {
        return alt;
      }
    },
    judgeSub(bool, val, alt) {
      if (bool) {
        return val;
      } else {
        return alt;
      }
    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.filterSend()
    },

    handleCurrentChange(val) {
      this.curPage = val;
      this.filterSend()
    },
    filterSend() {
      this.sendReq(this.queryString, this.generateFilterObj(), this.curPage, this.pageSize)
    },

    sortChange(selected) {
      this.filterSend()
    },
    unique(arr) {
      return Array.from(new Set(arr))
    },

    changeQuery(str, offset) {
      this.queryString = str
      this.searchPath = "searchArticleByKW"

      this.filterSend()
      Vue.set(this.dispArticleArr, offset, false)

    }


  },
}
</script>

<style scoped>
.toLeft {
  text-align: left !important;
}

.dispCard {
  margin-bottom: 2%;
}

.highlight {
  background-color: yellow;
}
</style>
